<template>
  <BoTable
    :columns="columns"
    :request="getDeviceList"
    ref="tableRef"
    :row-selection="rowPushSelection"
    row-key="deviceId"
    height="auto"
  >
  </BoTable>
</template>

<script setup lang="tsx">
import { computed, ref } from 'vue';
import { getDeviceModelSelect, getDeviceProjectSelect } from '@/api';
import { deviceEnum } from '@/constants';
import { useDicts } from '@boeyo/portal';
import { listToEnum, listToOption } from '@boeyo/shared';
import { BoTable, BoTableProps } from '@boeyo/ui';
import { getDeviceList } from '../../api';

const emit = defineEmits(['update:value']);

// 推送列表
const selectKeys = ref<any[]>([]);
const rowPushSelection = computed<BoTableProps['rowSelection']>(() => {
  return {
    selectedRowKeys: selectKeys.value,
    onChange(values, all) {
      selectKeys.value = values as any;
      emit('update:value', all);
    },
  };
});

const dictArr = ['file_upgrade_type', 'device_type', 'online_status'];
const { deviceTypeEnum, onlineStatusEnum } = useDicts(dictArr);

// 获取表单下拉框数据
const projectOptions = ref<any[]>([]);
const projectEnum = ref<Record<string, any>>({});
const modelOptions = ref<any[]>([]);
const modelEnum = ref<Record<string, any>>({});
const init = () => {
  getDeviceProjectSelect().then(({ data }) => {
    projectOptions.value = listToOption(data, 'name', 'projectId');
    projectEnum.value = listToEnum(data, 'name', 'projectId');
  });
  getDeviceModelSelect(deviceEnum.SEISMOGRAPH).then(({ data }) => {
    modelOptions.value = listToOption(data, 'model', 'modelId');
    modelEnum.value = listToEnum(data, 'model', 'modelId');
  });
};
init();

const columns = computed<BoTableProps['columns']>(() => [
  {
    title: '序号',
    dataIndex: 'index',
    customRender({ renderIndex, index }) {
      return renderIndex + 1;
    },
    hideInSearch: true,
  },
  {
    title: '设备编号',
    dataIndex: 'stationId',
    hideInSearch: open.value,
  },
  {
    title: '设备序列号',
    dataIndex: 'deviceCode',
    hideInSearch: open.value,
  },
  {
    title: '设备类型',
    dataIndex: 'deviceType',
    valueEnum: deviceTypeEnum.value,
    valueType: 'select',
    hideInSearch: true,
  },
  {
    title: '设备型号',
    dataIndex: 'modelId',
    valueEnum: modelEnum.value,
    hideInSearch: true,
  },
  {
    title: '在线状态',
    dataIndex: 'adminOnlineStatus',
    valueType: 'status',
    valueEnum: onlineStatusEnum.value,
    hideInSearch: true,
  },
]);
</script>

<style lang="scss" scoped></style>
